import { FormSchema } from '@/components/Form';
import { computed } from 'vue';
import { h } from 'vue';
import { Rule as ValidationRule } from 'ant-design-vue/lib/form/interface';
import { useI18n } from '@/hooks/web/useI18n';
import { getDeliveryApi } from '@/api/sys/sysOrder';
import { areaListApi } from '@/api/sys/sysData';
import { uploadApi, uploadImgApi } from '@/api/sys/upload';
import ApiCascader from '@/components/Form/src/components/ApiCascader.vue';

const { t } = useI18n();

const getMobileFormRule = computed(() => createRule(t('sys.login.mobilePlaceholder')));
function createRule(message: string): ValidationRule[] {
  return [
    {
      required: true,
      message,
      trigger: 'change',
    },
  ];
}
export const formSchema: FormSchema[] = [
  {
    field: 'companyName',
    label: '公司名称',
    component: 'Input',
    required: true,
  },
  {
    field: 'contactName',
    label: '联系人',
    component: 'Input',
    required: true,
  },
  {
    field: 'mobile',
    label: '联系方式',
    component: 'InputNumber',
    required: true,
  },
  {
    field: 'companyAreasArr',
    label: '省/市/区',
    component: 'ApiCascader',
    required: true,
    componentProps: {
      api: areaListApi,
      // mode:"multiple",
      resultField: 'data',
      labelField: 'name',
      apiParamKey: 'parentId',
      valueField: 'id',
    },
  },
  {
    field: 'shopAddress',
    label: '地址(退货)',
    component: 'Input',
    required: true,
  },
  {
    field: 'qrCodeArr',
    label: '公众号二维码',
    required: false,
    component: 'Upload',
    componentProps: {
      api: uploadImgApi,
      multiple: false,
      accept: ['.png', '.jpeg', '.jpg'],
      resultField: 'data.data',
      maxSize: 10,
      maxNumber: 1,
    },
  },
];
